<template>
	<view class="resume-layer-container">
		<u-popup class="resume-layer-popup pore" v-if="showDialog" :show="showDialog" @close="handleCloseLayer" mode="center"
			:customStyle="{'width':'316px','position':'relative'}" @open="showDialog = true" round="20"
			bgColor="transparent">
			<view class="resume-layer-wrap">
				<image class="common-icon" src="https://hxs.dsjhs.com:553/prod-api/profile/ddsh.png" mode=""></image>
				<view class="layer-title">
					<!-- <text class="layer-tip">{{ formatLayerText.title }}</text> -->
					<view class="layer-tip">您已提交报名表，请等待审核</view>
					<view class="layer-text">请在【人才超市-我的报名】中查看详情</view>
				</view>
				<view class="btn-wrap receive-btn">
					<button class="receive-btn-text" @tap="handleConfirm">去看看</button>
				</view>
			</view>
			<view class="close-btn-wrap" @tap="handleCloseLayer"></view>
		</u-popup>
	</view>
	
</template>

<script>

	export default {
		props: {
			showDialog: {
				type: Boolean,
				default: false
			},
			resumeStatus: {
				type: Number,
				required: true
			},
		},
		data() {
			return {
				
			}
		},
		computed: {
			
		},

		methods: {
			handleCloseLayer() {
				this.$emit('close')
			},
			handleConfirm() {
				this.$emit('submit')
			},
			handleSubmimt() {
				uni.redirectTo({
					url: '/subpage/talentemployment/employment/addresume'
				})
			}
		}
	}
</script>

<style lang="scss">
	.resume-layer-container {
		.resume-layer-wrap {
			position: relative;
			width: 632rpx;
			height: 600rpx;
			padding: 48rpx 0 32rpx;
			background: #F2F5FF;
			// background-size: 100% 100%;
			box-sizing: border-box;
			border-radius: 40rpx;
			.layer-title {
				text-align: center;
				.layer-tip {
					display: block;
					margin-bottom: 12rpx;
					font-weight: 600;
					font-size: 32rpx;
					color: #34314F;
					line-height: 44rpx;
					text-align: center;
				}
				.layer-text {
					font-weight: 400;
					font-size: 32rpx;
					color: #34314F;
					line-height: 44rpx;
					text-align: center;
					font-style: normal;
				}
			}
			
			.common-icon {
				display: block;
				width: 324rpx;
				height: 324rpx;
				margin: 0 auto;
			}
		}
		.receive-btn {
			display: flex;
			justify-content: center;
			width: 100%;
			margin-top: 20rpx;
			
			.receive-btn-text {
				width: 268rpx;
				height: 96rpx;
				background: #FFDE6D;
				border-radius: 20px;
				line-height: 96rpx;
				font-weight: 600;
				font-size: 32rpx;
				color: #34314F;
				text-align: center;
				margin: 0;
				
				&.cancel {
					margin-right: 32rpx;
					color: #34314F;
					background: rgba(52, 49, 79, 0.06);
				}
				
				&::after {
					border: 0;
				}
			}
		}
		
		.close-btn-wrap {
			position: relative;
			top: 32rpx;
			left: 50%;
			transform: translateX(-50%);
			width: 48rpx;
			height: 48rpx;
			background: url('@/static/images/close-icon.png') no-repeat center center;
			background-size: 100% 100%;
		}
		.ellipsis {
			max-width: 320rpx;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
	}
</style>